@import "../../../asset/style/index";
.head-img-wrap {
    width: 100%;
    position: relative;
    .head-imgs {
        width: 100%;
    }
    .head-ai {
        position: absolute;
        width: 76rpx;
        height: 76rpx;
        top: 32rpx;
        right: 140rpx;
        z-index: 100;
    }
    .head-fb {
        position: absolute;
        background: rgba(0,0,0,0);
        width: 76rpx;
        height: 76rpx;
        top: 32rpx;
        right: 32rpx;
        z-index: 100;
        border: 0;
        padding: 0;
        .head-fb-img {
            width: 76rpx;
            height: 76rpx;
        }
    }
    .head-fb:after{ border: none; }
}
.head-title-wrap {
    width: 100%;
    background: #ffffff;
    padding: 24rpx 32rpx;
    box-sizing: border-box;
    .text {
        color: #000000;
        font-size: 32rpx;
        font-weight: bold;
        margin-bottom: 24rpx;
    }
    .title {
        color: #666666;
        font-size: 28rpx;
    }
    .timer {
        color: #999999;
        font-size: 24rpx;
        margin-bottom: 32rpx;
        margin-top: 48rpx;
        .address-img {
            width: 34px;
            height: 34px;
            margin-right: 2px;
        }
        .address{
            color: #333333;
            font-size: 24px;
        }
    }
    .shop-wrap {
        width: 100%;
        margin-bottom: 24rpx;
        box-sizing: border-box;
        .shop-list {
            width: 100%;
            background: #F9F9F9;
            border-radius: 8px;
            padding: 38rpx 32rpx;
            box-sizing: border-box;
            .heads {
                width: 110rpx;
                height: 110rpx;
                margin-right: 32rpx;
                .mgs {
                    width: 110rpx;
                    height: 110rpx;
                    border-radius: 50%;
                }
            }
            .name {
                color: #393A3B;
                font-size: 32rpx;
                font-weight: bold;
                margin-bottom: 16rpx;
            }
            .time {
                color: #008589;
                font-size: 24rpx;
                margin-bottom: 16rpx;
            }
            .biaoti {
              color: #969798;
                font-size: 20rpx;
            }
            .btns-skip {
                margin-top: 33rpx;
                width: 130rpx;
                height: 56rpx;
                background: #FFFFFF;
                border: 1px solid #008589;
                border-radius: 44px;
                color: #008589;
                font-size: 28rpx;
            }
        }
    }
}
.comment-wrap {
    width: 100%;
    padding-left: 32rpx;
    padding-bottom: 120rpx;
    box-sizing: border-box;
    .comment-text {
        color: #666666;
        font-size: 28rpx;
        margin-bottom: 48rpx;
    }
    .comment-list {
        width: 100%;
        margin-bottom: 40rpx;
        .head-img-wrap {
            width: 72rpx;
            height: 72rpx;
            .imgs {
                width: 72rpx;
                height: 72rpx;
                border-radius: 50%;
            }
        }
        .comment-titles {
            width: 622rpx;
            padding-right: 34rpx;
            box-sizing: border-box;
            border-bottom: 1rpx solid #E2E3E4;
            padding-bottom: 40rpx;
            .name {
                color: #000000;
                font-size: 28rpx;
            }
            .timer {
                color: #999999;
                font-size: 22rpx;
                margin-bottom: 16rpx;
                .zan-text {
                    color: #666666;
                    font-size: 24rpx;
                    .head-zan {
                        width: 34rpx;
                        height: 34rpx;
                        margin-left: 6rpx;
                    }
                }
            }
            .title {
                color: #000000;
                font-size: 28rpx;
                word-wrap:break-word;
                word-break:break-all;
            }
        }
    }
}

.report-comment {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #FFFFFF;
    box-shadow: 0 0 12px rgba(149, 149, 149, 0.12);
    padding: 10rpx 32rpx;
    padding-bottom: 48rpx;
    box-sizing: border-box;
    .inp-wrap {
        width: 520rpx;
        min-height: 72rpx;
        background: #F9F9F9;
        border-radius: 36rpx;
        padding: 0 32rpx;
        box-sizing: border-box;
        .at-input__input {
            text-align: left !important;
        }
    }
    .report-ai {
        width: 60rpx;
        height: 72rpx;
    }
    .comment-btn {
        width: 130rpx;
        height: 56rpx;
        background: #FFFFFF;
        border: 1rpx solid #008589;
        border-radius: 44rpx;
        color: #008589;
        font-size: 28rpx;
    }
}

.more-content-wrap {
    width: 100%;
    background: #F6F7F7;
    border-radius: 40rpx 40rpx 0 0;
    overflow: hidden;
    .cancel-text {
        width: 100%;
        height: 148rpx;
        background: #ffffff;
        box-sizing: border-box;
        padding-bottom: 16px;
        color: #393A3B;
        font-size: 32rpx;
        font-weight: bold;
        margin-top: 12rpx;
    }
    .list-text {
        width: 100%;
        background: #ffffff;
        height: 116rpx;
        color: #393A3B;
        font-size: 32rpx;
        font-weight: bold;
        box-sizing: border-box;
    }
    .list-text-delete {
        border-top: 1rpx solid #E2E3E4;
        color: #FC5261;
    }
}
